import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:sptapp/config/const.dart';
import 'package:sptapp/moudle/common_info.dart';

import '../../api/interface/home_api.dart';
import '../../api/request/response_data.dart';

class DeviceControlSelect extends StatefulWidget {
  final Map item;
  final Function callBack;
  const DeviceControlSelect({super.key, required this.item, required this.callBack,});

  @override
  State<DeviceControlSelect> createState() => _DeviceControlSelectState();
}

const String BSOC1 = 'BSOC1';
const String BSOC2 = 'BSOC2';
const String BSOCG1 = 'BSOCG1';
const String BSOCG2 = 'BSOCG2';

class _DeviceControlSelectState extends State<DeviceControlSelect> {

  int selIndex = 0;
  List options = [];
  int defaultIndex = 0;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    List arr = widget.item['options'] ?? [];
    for (var item in arr) {
      if(item is Map){
        Map map = item;
        map.forEach((key,value){
          if(key.toString() != 'desc'){
            options.add({
              'name':key,
              'value':value,
              'desc':map['desc']??''
            });
          }
        });
      }
    }
    for(int i = 0;i<options.length;i++){
      if(widget.item['value'] == options[i]['name']){
        selIndex = i;
        defaultIndex = selIndex;
      }
    }
    if(options.isNotEmpty){
      if(defaultIndex != 0){
        Map item = options[defaultIndex];
        options.removeAt(defaultIndex);
        options.insert(0, item);
        defaultIndex = 0;
        selIndex = 0;
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(top: 32.w,bottom: ScreenUtil().bottomBarHeight+16.w),
      decoration: BoxDecoration(
          color: Color(0xff1E1D20),
          borderRadius: BorderRadius.only(topLeft: Radius.circular(32.w),topRight: Radius.circular(32.w))
      ),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          Container(
            padding: EdgeInsets.only(left: 48.w,right: 48.w,),
            child: Column(
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Expanded(child: Column(
                      children: [
                        Text(widget.item['name']??'',style: TextStyle(
                            color: Colors.white,
                            fontSize: 28.sp,
                            fontWeight: FontWeight.w600
                        ),),
                        Visibility(child: Text(widget.item['subTitle']??'',style: TextStyle(
                            color: Color.fromRGBO(255, 255, 255, 0.5),
                            fontSize: 24.sp,
                            fontWeight: FontWeight.w400,
                            height: 1.6
                        ),),visible: widget.item['subTitle']!=null&& widget.item['subTitle'].toString().isNotEmpty,)
                      ],
                      crossAxisAlignment: CrossAxisAlignment.start,
                    )),
                    SizedBox(width: 10.w,),
                    GestureDetector(
                      onTap: (){
                        Navigator.of(context).pop();
                      },
                      child: Icon(Icons.close,size: 48.sp,color: Color(0xff999999),),
                    )
                  ],
                ),
                SizedBox(height: 32.w,),
                Container(height: 1.w,color: Color.fromRGBO(255, 255, 255, 0.1),),
              ],
            ),
          ),
          Container(
            height: 590.w,
            color: Colors.transparent,
            child: ListView.builder(itemBuilder: (ctx,index){

              Map item = options[index];

              return GestureDetector(
                onTap: ()async{
                  setState(() {
                    selIndex = index;
                  });
                },
                child: Container(
                  alignment: Alignment.center,
                  decoration: BoxDecoration(
                      color: selIndex == index  ? Color.fromRGBO(255, 255, 255, 0.1):Colors.transparent,
                      border: Border(bottom: BorderSide(color: Color.fromRGBO(255, 255, 255, 0.1),width: 1.w)),
                    // color: Colors.red
                  ),
                  padding: EdgeInsets.symmetric(vertical: 34.w,horizontal: 48.w),
                  child: Row(
                    children: [
                      Expanded(child:  Container(
                        child: Column(
                          children: [
                            Row(
                              children: [
                                Expanded(child: Row(
                                  children: [
                                    Text(item['name']??'',style: TextStyle(
                                        color: Colors.white,
                                        fontSize: 28.sp,
                                        fontWeight: FontWeight.w600
                                    ),),
                                    Visibility(visible: defaultIndex == index,child: Container(
                                      width: 106.w,
                                      height: 44.w,
                                      margin: EdgeInsets.only(left: 16.w),
                                      alignment: Alignment.center,
                                      decoration: BoxDecoration(
                                          border: Border.all(color: Color.fromRGBO(255, 255, 255, 0.5)),
                                          color: Color.fromRGBO(255, 255, 255, 0.1),
                                        borderRadius: BorderRadius.circular(4.w)
                                      ),
                                      child: Text('Default',style: TextStyle(
                                          color: Colors.white,
                                          fontSize: 24.sp,
                                          fontWeight: FontWeight.w400
                                      ),),
                                    ),)
                                  ],
                                )),
                                SizedBox(height: 24.w,),
                                Visibility(visible: true,child: GestureDetector(
                                  onTap: ()async{
                                    setState(() {
                                      selIndex = index;
                                    });
                                    // Map<String,dynamic> data = {
                                    //   'sn': baseDeviceNum??'',
                                    //   'value': options[index]['value'],
                                    //   'code':widget.item['code']
                                    // };
                                    // ResponseData result = await HomeAPI.postDevParameter(data);
                                    // if(result.code == 200){
                                    //   if(widget.callBack!=null){
                                    //     widget.callBack(options[index]);
                                    //   }
                                    //   Navigator.of(context).pop();
                                    // }

                                  },
                                  child: Container(
                                    width: 48.w,
                                    height: 48.w,
                                    alignment: Alignment.center,
                                    child: Image.asset(index == selIndex?'assets/common/control_circle_sel.png':'assets/common/control_circle.png',width: 48.w,),
                                  ),
                                ),)
                              ],
                            ),
                            Visibility(visible: selIndex == index && item['desc'] != null && item['desc'].toString().isNotEmpty,child: Container(
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Container(
                                    height: 1.w,
                                    margin: EdgeInsets.symmetric(vertical: 32.w),
                                    color: Color.fromRGBO(255, 255, 255, 0.1),
                                  ),
                                  Text(item['desc']??'',
                                    style: TextStyle(
                                      fontWeight: FontWeight.w400,
                                      fontSize: 24.sp,
                                      color: Color.fromRGBO(255, 255, 255, 0.5),
                                    ),)
                                ],
                              ),
                            ),),
                            // Visibility(visible: item['optionType'].toString() == '2' && selIndex == index && item['optionTypeShow'].toString() == '1',child: Container(
                            //   child: Column(
                            //     children: [
                            //       Container(
                            //         height: 1.w,
                            //         margin: EdgeInsets.symmetric(vertical: 32.w),
                            //         color: Color.fromRGBO(255, 255, 255, 0.1),
                            //       ),
                            //       ListView.builder(itemBuilder: (ctx,index){
                            //
                            //         return GestureDetector(
                            //           onTap: ()async{
                            //
                            //           },
                            //           child: Container(
                            //             alignment: Alignment.center,
                            //             child: Row(
                            //               children: [
                            //                 Expanded(child:  Container(
                            //                   child: Column(
                            //                     children: [
                            //                       Row(
                            //                         children: [
                            //                           Expanded(child: Row(
                            //                             children: [
                            //                               Text(options[index]['name']??'',style: TextStyle(
                            //                                   color: Colors.white,
                            //                                   fontSize: 28.sp,
                            //                                   fontWeight: FontWeight.w600
                            //                               ),),
                            //                               Visibility(visible: defaultIndex == index,child: Container(
                            //                                 width: 106.w,
                            //                                 height: 44.w,
                            //                                 margin: EdgeInsets.only(left: 16.w),
                            //                                 alignment: Alignment.center,
                            //                                 decoration: BoxDecoration(
                            //                                     border: Border.all(color: Color.fromRGBO(255, 255, 255, 0.5)),
                            //                                     color: Color.fromRGBO(255, 255, 255, 0.1),
                            //                                     borderRadius: BorderRadius.circular(4.w)
                            //                                 ),
                            //                                 child: Text('Default',style: TextStyle(
                            //                                     color: Colors.white,
                            //                                     fontSize: 24.sp,
                            //                                     fontWeight: FontWeight.w400
                            //                                 ),),
                            //                               ),)
                            //                             ],
                            //                           )),
                            //                           SizedBox(height: 24.w,),
                            //                           Visibility(visible: true,child: GestureDetector(
                            //                             onTap: ()async{
                            //
                            //                             },
                            //                             child: Container(
                            //                               width: 48.w,
                            //                               height: 48.w,
                            //                               alignment: Alignment.center,
                            //                               child: Image.asset(index == selIndex?'assets/common/control_circle_sel.png':'assets/common/control_circle.png',width: 48.w,),
                            //                             ),
                            //                           ),)
                            //                         ],
                            //                       ),
                            //                       Visibility(visible: true,child: Container(
                            //                         child: Column(
                            //                           crossAxisAlignment: CrossAxisAlignment.start,
                            //                           children: [
                            //                             Container(
                            //                               height: 1.w,
                            //                               margin: EdgeInsets.symmetric(vertical: 32.w),
                            //                               color: Color.fromRGBO(255, 255, 255, 0.1),
                            //                             ),
                            //                             Text('asdjasdasd asd as d as d as d asd as d asasdjasdasd asd as d as d as d asd as d asasdjasdasd asd as d as d as d asd as d asd as ',
                            //                               style: TextStyle(
                            //                                 fontWeight: FontWeight.w400,
                            //                                 fontSize: 24.sp,
                            //                                 color: Color.fromRGBO(255, 255, 255, 0.5),
                            //                               ),)
                            //                           ],
                            //                         ),
                            //                       ),),
                            //                     ],
                            //                   ),
                            //                 )),
                            //               ],
                            //             ),
                            //           ),
                            //         );
                            //       },padding: EdgeInsets.zero,itemCount: 4,physics: NeverScrollableScrollPhysics(),shrinkWrap: true,)
                            //     ],
                            //   ),
                            // ),)
                          ],
                        ),
                      )),
                    ],
                  ),
                ),
              );
            },padding: EdgeInsets.zero,itemCount: options.length,),
          ),
          GestureDetector(
            onTap: ()async{
              Map<String,dynamic> data = {
                'sn': baseDeviceNum??'',
                'value': options[selIndex]['value'],
                'code':widget.item['code']
              };
              if(widget.callBack!=null){
                widget.callBack(options[selIndex]);
              }
              ResponseData result = await HomeAPI.postDevParameter(data);
              if(result.code == 200){
                if(widget.callBack!=null){
                  widget.callBack(options[selIndex]);
                }
                Navigator.of(context).pop();
              }
            },
            child: Container(
              alignment: Alignment.center,
              height: 108.w,
              margin: EdgeInsets.symmetric(horizontal: 40.w),
              decoration: BoxDecoration(
                color: themeColor,
                borderRadius: BorderRadius.circular(8.w)
              ),
              child: Text('Continue'.tr,style: TextStyle(
                fontSize: 32.sp,
                fontWeight: FontWeight.w600,
                color: Colors.white
              ),),
            ),
          ),
        ],
      ),
    );
  }
}
